<html>
	<head>
		<link rel="stylesheet" type="text/css" href="static/rentsplitter.css"/>
		<link rel="stylesheet" type="text/css" href="static/jquery-ui.css"/>
		<script type="text/javascript" src="static/jquery-1.6.1.min.js"></script>
		<script type="text/javascript" src="static/jquery-ui-1.8.13.custom.min.js"></script>
		<script type="text/javascript">
			{% block customJavascript %}
			{% endblock customJavascript %}
		</script>
	</head>
	<body>
		<div class="header">
			<h1>Rent Splitter</h1>
			<table>
				<tr>
				<th align="left">
					<h3>A tool to help split costs between roomates</h3>
				</th>
				<th align="right">
					{% if username %}
					<h3 class="right">Logged in as {{username}} <a href="{{logoutUrl}}">Logout</a></h3>
					{% else %}
					<h3 class="right"><a href="{{loginUrl}}">Login</a></h3>
					{% endif %}
				</th>
				</tr>
			</table>
		</div>
		<div class="content">
		{% block content %}
			Default content, if you see this you need to extend this template;
		{% endblock content %}
		</div>
	</body>
</html>
